<template>
  <div class="login">
    <div class="back">
        <i class="iconfont icon-fanhui" style="font-size:20px;font-weight:bold" @click='backPath'></i>
    </div>
    <div class="vans">
        <h2>请登陆</h2>
        <van-form @submit="onSubmit">
          <van-field
            v-model="username"
            name="username"
            label="用户名"
            placeholder="用户名"
            :rules="[{ required: true, message: '请填写用户名' }]"
          />
          <van-field
            v-model="password"
            type="password"
            name="password"
            label="密码"
            placeholder="密码"
            :rules="[{ required: true, message: '请填写密码' }]"
          />
          <div style="margin: 16px">
            <van-button style="height:30px" round block type="info" native-type="submit"
              >登录</van-button
            >
          </div>
        </van-form>
    </div>
  </div>
</template>

<script>
import Vue from "vue";
import {Form, Field,Button } from "vant";

Vue.use(Form);
Vue.use(Field);
Vue.use(Button);
export default {
    data() {
    return {
      username: '',
      password: '',
    };
  },
  methods: {
    onSubmit(values) {  //登录
    //   console.log('submit', values);
    sessionStorage.setItem('token', 520);
    this.$router.push('./cart')
    },
    backPath(){
        this.$router.go(-1)
    }
  },
};
</script>

<style scoped lang='scss'>
.back{
    padding: 50px;
}
.vans{
    text-align: center;
    width: 90%;
    margin: 300px auto;
    border: 1px solid black;
}

</style>